<template>
    <el-container class="all">
        <el-header class="head">
            <div>
<!--                <img style="height: 60px;width: 60px" src="" alt="tihs is a pic">-->
                <span style="padding-left: 2vw">欢迎进入问卷管理系统</span>
            </div>
            <el-button type="info" @click="out">退出</el-button></el-header>
        <el-container>
            <el-aside :width="iscoll?'65px':'200px'" class="aside">
                <div class="toggle-btn" @click="togg">|||</div>
                <el-menu
                        background-color="#404040"
                        text-color="#fff"
                        active-text-color="#87CEEB"
                        unique-opened
                        :collapse="iscoll"
                        :collapse-transition="false"
                        router

                        >
                    <el-submenu index="1">
                        <template slot="title">
                            <i class="el-icon-location"></i>
                            <span>用户管理</span>
                        </template>
                            <el-menu-item index="alluser">显示所有用户</el-menu-item>
                            <el-menu-item index="adduser">添加用户</el-menu-item>
                            <el-menu-item index="upuserpass">修改用户密码</el-menu-item>
                            <el-menu-item index="deluser">删除用户</el-menu-item>
                    </el-submenu>
                    <el-menu-item index="viewlog">
                        <i class="el-icon-menu"></i>
                        <span slot="title">查看日志</span>
                    </el-menu-item>
                    <el-submenu index="4">
                        <template slot="title">
                            <i class="el-icon-setting"></i>
                            <span>个人中心</span>
                        </template>
                        <el-menu-item index="changepass">修改管理员密码</el-menu-item>
                        <el-menu-item index="resetadmin">重设管理员密码</el-menu-item>
                    </el-submenu>
                </el-menu></el-aside>
            <el-main class="main"><router-view></router-view></el-main>
        </el-container>
    </el-container>
</template>

<script>
    import {removeToken} from "../../utils/auth";

    export default {
        name: "AdminHome",
        data(){
            return{
                iscoll:false,
            }
        },
        methods:{
            out(){
                removeToken();
                this.$router.push("/admin/login")
            },

            togg(){
                this.iscoll = !this.iscoll
            },

        }
    }
</script>


<style lang="less" scoped>
    .head{
        background-color: #666666;
        display: flex;
        justify-content: space-between;
        padding-left: 0;
        align-items: center;
        color: white;
        font-size: 20px;
        >div{
            display: flex;
            align-items: center;

            span{
                margin-left: 10px;
            }
        }
    }
    .aside{
        background-color: #404040;
    }
    .main{
        background-color: whitesmoke;
    }
    .all{
        height: 100%;
    }
    .iconfont{
        padding-right: 10px;
    }
    .el-menu{
        border-right:none ;
    }
    .toggle-btn{
        background-color: #666666;
        font-size: 10px;
        line-height: 24px;
        color: white;
        text-align: center;
        letter-spacing: 0.3em;
        cursor: pointer;
    }
</style>
